<!DOCTYPE HTML>
<html lang="en-US">
  <head>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
  <title>login</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/buijs/lib/latest/bui.css" />
  <link rel="stylesheet" href="css/style.css" />
   <link rel="stylesheet" type="text/css" href="./css/font.css"/>
  </head>
  <style type="text/css">
  	.but-pay{
  		width: 80%;
  		height: 40px;
  		background-color: #2B57DA;
  		color: #FFFFFF;
  		bottom: 30px;
  		border-radius: 8px;
  		text-align: center;
  		line-height: 40px;
  		size: 50px;
  		margin:auto;
  		font-weight: 600;
  		margin-top: 30px;
  	}
	.but-play{
		width: 80%;
		height: 40px;
		border: 1px solid #2B57DA;
		color: #2B57DA;
		bottom: 30px;
		border-radius: 8px;
		text-align: center;
		line-height: 40px;
		size: 50px;
		margin:auto;
		font-weight: 600;
		margin-top: 15px;
	}
	.bootom-page{
		background: url(img/login-bg.png) no-repeat;
		width: 100%;
		height: 128px;
		background-size: 100%;
		position: fixed;
		bottom: 0;
		z-index: 0;
	}
  </style>
  <body>
    <div class="bui-page bui-box-vertical">
        <header>
            <!-- 固定顶部区 -->
          
        </header>
        <main>
          <!-- 固定中间滚动内容区 -->
		  <div style="width: 100%;text-align: center;">
			   <img src="img/logo.png" width="80" height="80" style="margin-top: 40px;">
			   <h2>AstraZeneca</h2>
		  </div>
		 
		  <div style="margin-top: 15px;margin-left: 45px;margin-right: 45px;">
			  <div class="bui-input user-input" style="border-bottom: 1px solid #eee;height: 50px;text-align: center;">
			     <h3 style="font-weight: 600;">91</h3> <input id="phonenumber" type="number" class="bui-input" style="margin-left: 5px;" value="" placeholder="Please enter your account">
			  </div>
			  <div class="bui-input user-input" style="border-bottom: 1px solid #eee;height: 50px;text-align: center;margin-top: 20px;">
			     <input id="phonenumber" type="number" class="bui-input" style="margin-left: 5px;" value="" placeholder="Please enter the password">
			  </div>
		  </div>
		 <h6 style="color: #2B57DA;margin-top: 15px;text-align: center;font-size: 15px;font-weight: 700;" id="ForgetPassword">Forget password</h6>
		 <div class="but-pay">
			 login
		 </div>
		  <div class="but-play">
			 download 
		  </div>
		  
		  <div class="bootom-page">
			  
		  </div>
        </main>
        <footer>
          <!-- 固定底部   -->
        </footer>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/buijs/lib/zepto.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/buijs/lib/latest/bui.js"></script>
    <script>
        bui.ready(function() {
          // 所有控件及方法需要在这里执行
		  
		  $("#ForgetPassword").on("click", function(argument) {
		  	bui.load({
		  		url: "./retrieve_password.html",
		  		param: {
		  			parameter: "parameter"
		  		}
		  	});
		  })
        })
    </script>
  </body>
</html>
